<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书管理</title>
<%@include file="/pages/common/head.jsp"%>
	<script type="text/javascript">
		$(function (){
			//给删除的a标签绑定点击事件,用于删除的确认提示操作
			$("a.deleteClass").click(function (){
				/**
				 * 在事件的function函数中,有一个this对象.这个this对象,是当前正在响应事件的dom对象
				 *
				 * confirm是确认提示函数框
				 * 参数是他的提示内容
				 * 他有两个按钮,一个是确认,一个是取消
				 * 返回true表示点击了确认 ， 返回false表示点击了取消
				 *
				 * return false   阻止元素的默认行为 === 不提交请求
				 */
				return confirm("你确定要删除【" + $(this).parent().parent().find("td:first").text() + "】?");
			});
		})
	</script>
</head>
<body>
	
	<div id="header">
			<img class="logo_img" alt="" src="static/img/logo.gif" >
			<span class="wel_word">图书管理系统</span>
			<%@include file="/pages/common/manager_menu.jsp"%>
	</div>
	
	<div id="main">
		<table>
			<tr>
				<td>名称</td>
				<td>价格</td>
				<td>作者</td>
				<td>销量</td>
				<td>库存</td>
				<td colspan="2">操作</td>
			</tr>		
			<!--对Request域中的数据进行遍历输出-->
			<c:forEach items="${requestScope.page.items}" var="book">
				<tr>
					<td>${book.name}</td>
					<td>${book.price}</td>
					<td>${book.author}</td>
					<td>${book.sales}</td>
					<td>${book.stock}</td>
					<td><a href="manager/bookServlet?action=getBook&id=${book.id}&pageNo=${requestScope.page.pageNo}">修改</a></td>
					<td><a class="deleteClass" href="manager/bookServlet?action=delete&id=${book.id}&pageNo=${requestScope.page.pageNo}">删除</a></td>
				</tr>
			</c:forEach>
			<tr>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
				<!--
					添加图书的时候,需要跳转到page页面才可以
					因为现在主要展示就是page页面
					而添加完之后,需要显示最后一页,因为要查看添加的最新数据
				-->
				<td><a href="pages/manager/book_edit.jsp?pageNo=${requestScope.page.pageTotal}">添加图书</a></td>
			</tr>	
		</table>
		<%@include file="/pages/common/page_nav.jsp"%>
	</div>
	
	<%@include file="/pages/common/footer.jsp"%>

	<script type="text/javascript">
		$(function (){
			//跳转到指定的页码
			$("#searchPageBtn").click(function (){
				var pageNo = $("#pn_input").val();
				/**
				 * javascript语言提供了一个location地址栏对象
				 * 他有一个属性叫href.可以获取浏览器中地址栏中的地址
				 * href属性可读,可写
				 */
				var pageTotal = "${requestScope.page.pageTotal}";
				//这里前端对页码数进行验证
				//页码数最小为1,最大为总页数,如果输入的页码数小于1的话,就直接让等于1,如果大于总页码,就把总页码给他
				if(pageNo < 1){
					pageNo = 1;
				}
				if(pageNo > parseInt(pageTotal)){
					pageNo = pageTotal;
				}
				location.href = "${pageScope.basePath}${requestScope.page.url}&pageNo=" + pageNo;
			});
		})
	</script>


</body>
</html>